var list = 0
var listSize = 0
var perSize = 0
var max_page = 0
window.addEventListener('load', () => {
    list = document.getElementById('list')
    listSize = list.childElementCount
    perSize = 5
    max_page = parseInt(Math.ceil(listSize / 5))
    document.getElementById('pager').max = max_page
    if (list !== undefined && list !== null) change(1)
})

function add(i) {
    change(parseInt(document.getElementById('pager').value) + i)
}

function change(v) {
    var page = parseInt(v)
    page = Math.max(1, Math.min(max_page, page))
    for (var i = 0; i < listSize; ++i) list.children[i].style.display = 'none'
    var start = (page - 1) * perSize, end = Math.min(start + perSize, listSize)
    for (var i = start; i < end; i++) list.children[i].style.display = ''
    document.getElementById('pager').value = page
}